{% extends "base_wide_page.html" %}
{% load seahub_tags avatar_tags i18n %}

{% load staticfiles %}

{% block sub_title %}{% trans "History" %} - {% endblock %}

{% block extra_style %}
<link rel="stylesheet" type="text/css" href="{% static "css/select2-3.5.2.css" %}" />
<link rel="stylesheet" type="text/css" href="{% static "css/select2.custom.css" %}" />
<style type="text/css">
    .go-back { top:-3px; }
</style>
{% endblock %}

{% block wide_page_content %}
      <h2>{% blocktrans with repo_name=repo.props.name %}<span class="op-target">{{repo_name}}</span> Modification History{% endblocktrans %}</h2>

      {% if referer %}
      <a href="#" class="go-back" title="{% trans "Back" %}">
          <span class="icon-chevron-left"></span>
      </a>
      {% endif %}

      {% if user_perm == 'rw' %}
      <p class="tip">{% trans "Tip: a snapshot will be generated after modification, which records the library state after the modification."%}</p>
      {% endif %}

        <table class="commit-list">
            <tr>
                {% if show_label %}
                <th width="43%">{% trans "Description" %}</th>
                <th width="12%">{% trans "Time" %}</th>
                <th width="9%">{% trans "Modifier" %}</th>
                <th width="12%">{% trans "Device" %} / {% trans "Version" %}</th>
                <th width="12%">{% trans "Labels" %}</th>
                <th width="12%">{% trans "Operations" %}</th>
                {% else %}
                <th width="43%">{% trans "Description" %}</th>
                <th width="15%">{% trans "Time" %}</th>
                <th width="15%">{% trans "Modifier" %}</th>
                <th width="15%">{% trans "Device" %} / {% trans "Version" %}</th>
                <th width="12%">{% trans "Operations" %}</th>
                {% endif %}
            </tr>

            {% for commit in commits %}
            {% if commit.show %}
            <tr>
                <td>
                    {{ commit.props.desc|translate_commit_desc }}
                    {% if page_next or not forloop.last %}
                    <a class="lsch" href="#" data-url="{% url 'repo_history_changes' repo.id %}?commit_id={{ commit.id }}" data-time="{{ commit.props.ctime|tsstr_sec }}">{% trans "Details"%}</a>
                    {% endif %}
                </td>
                <td>{{ commit.ctime|translate_seahub_time }}</td>
                <td>
                {% if commit.creator_name %}
                    {% if not commit.second_parent_id %}
                    <a href="{% url 'user_profile' commit.creator_name %}" class="vam">{{ commit.creator_name|email2nickname }}</a>
                    {% else %}
                    {% trans "None"%}
                    {% endif %}
                {% else %}
                    {% trans "Unknown"%}
                {% endif %}
                </td>
                <td>
                    {% if commit.client_version %}
                    {{ commit.device_name }} / {{ commit.client_version }}
                    {% else %}
                    API / --
                    {% endif %}
                </td>
                {% if show_label %}
                <td data-id="{{ commit.id }}">
                    {% for label in commit.labels %}
                    <span class="cur-tag">{{ label }}</span>
                    {% endfor %}
                    {% if user_perm == 'rw' %}
                    <span class="sf2-icon-edit label-edit-icon op-icon vh" title="{% trans "Edit" %}"></span>
                    {% endif %}
                </td>
                {% endif %}
                <td>
                    {% if user_perm == 'rw' %}
                        {% if forloop.first and current_page == 1 %}
                        <span class="op vh">{% trans "Current Version" %}</span>
                        {% else %}
                        <a href="{% url 'repo_history_view' repo.id %}?commit_id={{ commit.id }}" class="op vh view-snapshot">{% trans "View Snapshot" %}</a>
                        {% endif %}
                    {% endif %}
                </td>
            </tr>
            {% endif %}
            {% endfor %}
        </table>
        <div id="paginator">
            {% if current_page != 1 %}
            <a href="?page={{ prev_page }}&referer={{referer|urlencode}}">{% trans "Previous"%}</a>
            {% endif %}
            {% if page_next %}
            <a href="?page={{ next_page }}&referer={{referer|urlencode}}">{% trans "Next"%}</a>
            {% endif %}
        </div>

{% if show_label and user_perm == 'rw' %}
<form id="label-edit-form" action="" class="hide">
    <h3 id="dialogTitle">{% trans "Edit labels" %}</h3>
    <input type="hidden" name="labels" /><br />
    <p class="error hide"></p>
    <button type="submit" class="submit">{% trans "Submit" %}</button>
</form>
{% endif %}

{% endblock %}

{% block extra_script %}
<script type="text/javascript" src="{% static "scripts/lib/select2-3.5.2.js" %}"></script>
<script type="text/javascript">
    {% include 'snippets/list_commit_detail.html' %}
    $('.view-snapshot').each(function() {
        $(this).attr('href', $(this).attr('href') + '&referer=' + encodeURIComponent(location.href));
    });

{% if show_label and user_perm == 'rw' %}
$('.label-edit-icon').on('click', function() {
    var $tr = $(this).parent();
    var s2_tags = [];
    $('.cur-tag', $tr).each(function(index, item) {
        var label = $(item).text();
        s2_tags.push({
            'id': label,
            'text': label
        });
    });

    var $form = $('#label-edit-form');
    $form.data('tr', $tr).modal({focus: false});
    $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
    $('[name="labels"]')
        .select2({
            width: '280px',
            tags: []
        })
        .select2('data', s2_tags);
});
$('#label-edit-form').on('submit', function() {
    var $form = $(this);
    var $input = $('[name="labels"]', $form);
    var $error = $('.error', $form);
    var $submit = $('[type="submit"]', $form);
    var $tr = $form.data('tr');
    var tags = $input.select2('val');

    disable($submit);
    $.ajax({
        url: '{% url "api-v2.1-revision-tags-tagged-items" %}',
        type: 'PUT',
        cache: false,
        dataType: 'json',
        data: {
            'repo_id': '{{repo.id}}',
            'commit_id': $tr.attr('data-id'),
            'tag_names': tags.join(',')
        },
        beforeSend: prepareCSRFToken,
        success: function(data) {
            var tags = data.revisionTags;
            var str = '';
            for (var i = 0, len = tags.length; i < len; i++) {
                str += '<span class="cur-tag">' + HTMLescape(tags[i].tag) + '</span>';
            }
            $('.cur-tag', $tr).remove();
            $tr.prepend(str);

            $.modal.close();
            feedback("{% trans "Successfully edited labels." %}", 'success');
        },
        error: function(xhr) {
            var error_msg;
            if (xhr.responseText) {
                error_msg = JSON.parse(xhr.responseText).error_msg;
            } else {
                error_msg = "{% trans "Failed. Please check the network." %}";
            }
            $error.html(error_msg).show();
            enable($submit);
        }
    });

    return false;
});
{% endif %}

{% include 'snippets/go_back_js.html' %}
</script>
{% endblock %}
